<template>
  <page-header-wrapper>
    <page-tab-list></page-tab-list>
    <a-card :border="false">
      <span>积分设置</span>
      <a-form-model
        ref="ruleForm"
        :model="settingForm"
        :rules="rules"
        :label-col="{ span: 4 }"
        :wrapper-col="{ span: 10 }"
      >
        <a-form-model-item label="每日签到获得分数" prop="register_integral">
          <a-input v-model="settingForm.register_integral" />
        </a-form-model-item>
        <a-form-model-item label="连续签到天数" prop="register_continuation">
          <a-input v-model="settingForm.register_continuation" addon-before="需连续签到" addon-after="天" />
        </a-form-model-item>
        <a-form-model-item label="连续签到奖励积分" prop="register_reward">
          <a-input-number v-model="settingForm.register_reward" style="width: 100%" :min="0" />
          <span class="tip">注 : 只要满足连续签到天数，中间没有断签，就一直赠送奖励积分</span>
        </a-form-model-item>
        <a-form-model-item label="签到规则" prop="register_rule">
          <WangEditor :value="content" @change="(e) => (settingForm.register_rule = e)"></WangEditor>
          <a-textarea :hidden="true" v-model="settingForm.register_rule" />
        </a-form-model-item>
        <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
          <a-button type="primary" @click="saveSetting">保存</a-button>
        </a-form-model-item>
      </a-form-model>
    </a-card>
  </page-header-wrapper>
</template>

<script>
import storage from 'store'
import { saveSetting, setting } from '@/api/plugin/integral'
import { WangEditor } from '@/components'
export default {
  name: 'IntegralSetting',
  components: {
    WangEditor,
  },
  data() {
    return {
      settingForm: {
        // 签到规则
        register_rule: '',
        // 每日签到获得分数
        register_integral: '',
        // 连续签到天数
        register_continuation: '',
        // 连续签到奖励
        register_reward: '',
      },
      // 验证规则
      rules: {
        register_reward: [{ required: true, message: '请输入连续签到奖励分数', trigger: 'blur' }],
        register_rule: [{ required: true, message: '请输入签到规则', trigger: 'blur' }],
        register_integral: [{ required: true, message: '请输入每日签到获得分数', trigger: 'blur' }],
        register_continuation: [{ required: true, message: '请输入连续签到天数', trigger: 'blur' }],
      },
      // 富文本内容
      content: '',
    }
  },
  created() {
    this.getSetting()
  },
  methods: {
    changeTab(val) {
      if (val == 1) {
        this.$router.push({ name: 'IntegralGoods' })
      }
      if (val == 2) {
        this.$router.push({ name: 'IntegralOrder' })
      }
    },
    // 获取设置配置
    async getSetting() {
      const hide = this.$message.loading('加载中', 0)
      const res = await setting()
      if (res.code == 0) {
        this.settingForm.register_rule = res.data.register_rule
        this.settingForm.register_integral = res.data.register_integral
        this.settingForm.register_continuation = res.data.register_continuation
        this.settingForm.register_reward = res.data.register_reward
        this.content = res.data.register_rule
      }
      hide()
    },
    // 保存设置
    saveSetting() {
      this.$refs.ruleForm.validate(async valid => {
        if (valid) {
          const res = await saveSetting({...this.settingForm,store_id:storage.get('storeId')})
          console.log(res);
          if(res.code == 0) {
            this.getSetting()
          }
        } else {
          return false
        }
      })
    },
  },
}
</script>
<style lang="less" scoped>
.permission-form {
  /deep/ .permission-group {
    margin-top: 0;
    margin-bottom: 0;
  }
}
.search-item {
  margin-left: 10px;
}
.tip {
  font-size: 14px;
  color: #ff4d4f;
}
</style>
